<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/header.css">
    <link rel="stylesheet" href="css/guide.css">
    <link rel="stylesheet" href="css/content.css">
    <link rel="stylesheet" href="css/choice.css">
    <link rel="stylesheet" href="css/serach.css">
    <link rel="stylesheet" href="css/box.css">
    <link rel="stylesheet" href="css/page.css">
    <link rel="stylesheet" href="css/call.css">
    <link rel="stylesheet" href="css/bottom.css">
</head>
<body>
        <div class="header"></div>
        <div class="guide">
            <div class="guide-detial">
                <div class="guide-left">
                    <span>  深圳</span>
                    <img src="images/定位.png" alt="" class="guide-left-imgone">
                </div>
                <div class="guide-right">
                    <img src="images/个人中心.png" alt="" class="guide-left-imgtwo">
                    <span>  个人中心</span>
                </div>
                <div class="guide-content">
                    <a href="#">首页</a>
                    <a href="#">咨询</a>
                    <a href="#">测评</a>
                    <a href="#">商城</a>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="content-title">
                <a href="#">首页 ></a>
                <a href="#">预防装修污染 ></a>
                <a href="#">材料库</a>
            </div>
            <div class="choice">
                <ul>
                    <li class="choice-first"> 类别 </li>
                    <li> 全部 </li>
                    <li> 地板 </li>
                    <li> 涂料 </li>
                    <li> 墙纸 </li>
                    <li> 瓷砖 </li>
                    <li> 粘胶 </li>
                    <li> 油漆 </li>
                    <li> 家具 </li>
                    <li> 板材 </li>
                    <li> 饰品 </li>
                </ul>
                <ul>
                    <li class="choice-first"> 类型 </li>
                    <li> 全部 </li>
                </ul>
                <ul>
                    <li class="choice-first"> 材质 </li>
                    <li> 全部 </li>
                    <li> 实木 </li>
                    <li> 复合 </li>
                    <li> 强化 </li>
                    <li> 其他 </li>
                </ul>
                <ul>
                    <li class="choice-first"> 品牌 </li>
                    <li> 全部 </li>
                    <li> 圣象 </li>
                    <li> 大自然 </li>
                    <li> 生活家 </li>
                    <li> 北美风情 </li>
                    <li> 德尔 </li>
                    <li> 傅典 </li>
                    <li> 船王 </li>
                </ul>
                
            </div>
            <div class="search">
                <div class="search-left">
                    <div >
                        <a href="#">发布时间 <img src="images/downicon.png" alt=""> </a>
                        <a href="#">价格<img src="images/upicon.png" alt=""></a>
                        <a href="#">环保节能<img src="images/upicon.png" alt=""></a>
                    </div>
                </div>
                <div class="search-right">
                    <div>
                        <a href="#" >  了解家具医生建材评级标准</a>
                        <img src="images/wenhao.png" alt="" class="search-right-img">
                    </div>
                </div>
                <div class="search-center">
                    <div class="search-center-detial">
                        <img src="images/search.png" alt="" class="search-img">
                        <button>搜索</button>
                        <input type="text" placeholder="搜索">
                    </div>
                </div>
                
            </div>
            <div class="box">
                <div>
                     <img src="images/data_image.png" alt="" class="box-img">
                     <p>  德尔    都市地板</p>
                     <p>  木地板-复合地板</p>
                     <p>  单价：128/m^2</p>
                     <p class="box-text">  环保评级B（可以使用）</p>
                </div>
                <div>
                     <img src="images/data_image.png" alt="" class="box-img">
                     <p>  德尔    都市地板</p>
                     <p>  木地板-复合地板</p>
                     <p>  单价：128/m^2</p>
                     <p class="box-text">  环保评级B（可以使用）</p>
                </div>
                <div>
                     <img src="images/data_image.png" alt="" class="box-img">
                     <p>  德尔    都市地板</p>
                     <p>  木地板-复合地板</p>
                     <p>  单价：128/m^2</p>
                     <p class="box-text">  环保评级B（可以使用）</p>
                </div>
                <div>
                     <img src="images/data_image.png" alt="" class="box-img">
                     <p>  德尔    都市地板</p>
                     <p>  木地板-复合地板</p>
                     <p>  单价：128/m^2</p>
                     <p class="box-text">  环保评级B（可以使用）</p>
                </div>
            </div>
            <div class="box">
                <div>
                    <img src="images/data_image.png" alt="" class="box-img">
                    <p>  德尔    都市地板</p>
                    <p>  木地板-复合地板</p>
                    <p>  单价：128/m^2</p>
                    <p class="box-text">  环保评级B（可以使用）</p>
               </div>
               <div>
                    <img src="images/data_image.png" alt="" class="box-img">
                    <p>  德尔    都市地板</p>
                    <p>  木地板-复合地板</p>
                    <p>  单价：128/m^2</p>
                    <p class="box-text">  环保评级B（可以使用）</p>
               </div>
               <div>
                    <img src="images/data_image.png" alt="" class="box-img">
                    <p>  德尔    都市地板</p>
                    <p>  木地板-复合地板</p>
                    <p>  单价：128/m^2</p>
                    <p class="box-text">  环保评级B（可以使用）</p>
               </div>
               <div>
                    <img src="images/data_image.png" alt="" class="box-img">
                    <p>  德尔    都市地板</p>
                    <p>  木地板-复合地板</p>
                    <p>  单价：128/m^2</p>
                    <p class="box-text">  环保评级B（可以使用）</p>
               </div>
            </div>
            <div class="page" >
                <div >
                <button class="page-button-one">上一页</button>
                <button class="page-button-two">下一页</button>
            </div>
            <div class="page-text">
                <div>
                    <a href="#">1</a>
                    <a href="#">2</a>
                    <a href="#">3</a>
                    <a href="#">4</a>
                    <a href="#">5</a>
                </div>
            </div>
            <div class="page-input"> 
                <div class="page-input-detial">
                    <input type="text" class="page-inputsite">
                    <div>
                        <p>共有10页，去第 <a href="">         </a><a href="">                           
                        </a>  <a href="">           </a> <a href="">      </a> 页</p>
                        <!-- <p class="page-p-site">页</p> -->
                    </div>
                    
                </div>
            </div>
                    <div>
                        <button class="page-button">确定</button>
                    </div>
            </div>
            <div class="call">
                <img src="images/small_weixin.png" alt="" class="call-img">
                <div >
                    <div class="call-p">
                        <p class="call-p-detial">材料检测 需求反馈</p>
                        <p>亲爱的用户，我们正在不断的完善和更新建材库，</p>
                        <p>若没有找到您想要的材料信息，请将您想测的建材告诉我们。</p>
                    </div>
                </div>
            </div>
            
        </div>
        <div class="bottom">
            <div class="bom">
                <div class="bom-left">
                    <img src="images/footerLogo.png" alt="">
                    <span class="boleft-text">
                        <p class="jiankang">为室内环境健康把好每一关</p>
                        <p>家居医生致力于中国人的家居健康问题，通过专业的技术研究</p>
                        <p>和测评，倾力协助大众打造绿色、环保的人居生活环境。</p>
                    </span>
                </div>
                <div class="bom-cen1">
                    <span>
                        <p>关于我们</p>
                        <p>联系我们</p>
                        <p>加入我们</p>
                    </span>
                </div>
                <div class="bom-cen2">
                    <span>
                        <p>版权说明</p>
                        <p>用户隐私</p>
                        <p>免责申明</p>
                    </span>
                </div>
                <div class="bom-right1">
                    <span>
                        <p><img src="images/weixin2.png" alt=""></p>
                        <p><img src="images/tianmao.png" alt=""></p>
                        <p><img src="images/shop.png" alt=""></p>
                    </span>
                </div>
    
                <div class="bom-right2">
                    <span>
                        <p>官方微信</p>
                        <p>天猫旗舰店</p>
                        <p>有赞商城</p>
                    </span>
                </div>
            </div>
            <div class="down">
                <span>
                    深圳建筑科学研究院股份有限公司
                </span>
                <span>家居医生网</span>
                <span class="down-right">粤ICP备08011321号 Copyright All Rights Reserved</span>
    
            </div>
        
</body>
</html>